<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
    <script src="/assets/js/bootstrap.min.js"></script>
    <title>博客列表</title>
  </head>
  <body>
    <div class="container">
      {{template "header"}}
      <div class="row mt-3">
        {{range $post := . -}}
        <div class="col-md-6">
          <div class="row g-0 border rounded overflow-hidden flex-md-row mb-4
            shadow-sm h-md-250 position-relative">
            <div class="col p-4 d-flex flex-column position-static">
              <strong class="d-inline-block mb-2 text-primary">分类</strong>
              <h3 class="mb-0">{{$post.Title}}</h3>
              <div class="mb-1 text-muted">Nov 12</div>
              <p class="card-text mb-auto">{{$post.Content}}</p>
              <a href="/post_detail?pid={{$post.ID}}" class="stretched-link">阅读更多...</a>
            </div>
            <div class="col-auto d-none d-lg-block">
              <svg class="bd-placeholder-img" width="200" height="250"
                xmlns="http://www.w3.org/2000/svg" role="img"
                aria-label="Placeholder: Thumbnail"
                preserveAspectRatio="xMidYMid slice" focusable="false"><title>Placeholder</title><rect
                  width="100%" height="100%" fill="#55595c"></rect><text x="50%"
                  y="50%" fill="#eceeef" dy=".3em">博客封面</text></svg>
            </div>
          </div>
        </div>
        {{- end}}
      </div>
    </div>
  </body>
</html>